<template>
    <view>
		<!-- 收货地址 -->
		<view class="revice_address_row">
			<view class="user_info_row">
				<view class="user_info">
					<view>{{address.userName}}</view>
					<view>{{address.all}}</view>
				</view>
				<view class="user_phone">{{address.telNumber}}</view>
			</view>
		</view>
		<!-- 购物车内容 -->
		<view class="cart_content">
			<view class="cart_title">确定订单</view>
			<view class="cart_main">
				<view class="cart_item"
				v-for="item in cart"
				:key="item.goods_id"
				>

				<!-- 图片 -->
				<view class="cart_img_wrap">
					<image mode="widthFix" :src="item.goods_small_logo"></image>
				</view>
				<!-- 信息 -->
				<view class="cart_info_wrap">
					<view class="goods_name">{{item.goods_name}}</view>
					<view class="goods_price_wrap">
						<view class="goods_price">￥{{item.goods_price}}</view>
						<view class="cart_num_tool">
							
							<view class="goods_num">× {{item.num}}</view>
							
						</view>
					</view>
				</view>
				</view>
			</view>
		</view>

		<!-- 底部工具栏 -->
		<view class="ft_bg">
			<view class="footer_tool">
		
		<!-- 总价格 -->
		<view class="total_price_wrap">
			<view class="total_price">
			合计：<text class="total_price_text">￥{{totalPrice}}</text>
			</view>
			<view>包含运费</view>
		</view>
		<view class="order_pay_wrap" @click="handleOrderPay">支付({{totalNum}})</view>
		</view>
		</view>

	</view>
</template>

<script>

	export default {
        data(){
			return{
				address:{},
				cart:[],
				totalPrice:0,
				totalNum:0
			}
    
    	},
		onLoad(){
			const noPay = 1;
			uni.setStorageSync('noPay', noPay);
		},
		onUnload(){
			
			let newCart = uni.getStorageSync('cart')||[];
			
			const noPay = uni.getStorageSync('noPay');
			if(noPay){
				//支付失败时选中的商品
				newCart.forEach(v=>{
					if(v.checked){
							//未支付订单
							let noPayCart = uni.getStorageSync('noPayCart')||[];
							noPayCart.push(v);
							uni.setStorageSync('noPayCart', noPayCart);
						
					}
				})
			}

			//支付失败时未选中商品重新写入购物车
			newCart = newCart.filter(v => !v.checked);
			uni.setStorageSync('cart', newCart);

			//重新设置token
			uni.removeStorageSync('token')

			
			
		},
		onShow(){
			//获取缓存中收货地址信息
			const address=uni.getStorageSync('address');
			//获取缓存中购物车数据
			let cart=uni.getStorageSync('cart')||[];
			cart = cart.filter(v=>v.checked);
			
			this.address = address;
			
			//计算总价格，总数量
			let totalPrice = 0;
			let totalNum = 0;
			cart.forEach(v => {
				totalPrice +=v.goods_price * v.num;
				totalNum += v.num;
				
			});

			//重新设置data数据
			this.cart = cart;
			this.totalPrice = totalPrice;
			this.totalNum = totalNum;


			
    	},
		methods:{
			handleOrderPay(){
				
				const token = uni.getStorageSync('token');
				if(!token){
					uni.navigateTo({
					url: '/pages/auth/index',
					})
					
					return;
				}
				//重新设置token
				uni.removeStorageSync('token')

				//是否登录账号
				const userinfo = uni.getStorageSync('userinfo');
				if(!userinfo){
					uni.switchTab({url:'/pages/user/index'})
					return;
					
				}
				

				//拿到缓存中购物车数组
				let newCart = uni.getStorageSync('cart')||[];

				//模拟订单
				let newMoney = 0;
				let money = uni.getStorageSync('money')||0;
				//支付成功选中的商品
				newCart.forEach(v=>{
					if(v.checked){
						//下单成功的订单
						let newPayCart = uni.getStorageSync('newPayCart')||[];
						newPayCart.push(v);
						uni.setStorageSync('newPayCart', newPayCart);
						
						//在零钱减去订单总价
						newMoney = money - this.totalPrice;
					}
				})

			
				uni.setStorageSync('money',newMoney);

				uni.removeStorageSync('noPay')

			
				uni.showToast({
					title: '支付成功',
					icon: 'success',
					duration: 2000,
					success: function () {
					setTimeout(function() {
						uni.switchTab({
						  url: '/pages/cart/index',
						})
						// uni.navigateBack({
						// 	delta: 2,
						// })
					}, 2000);
					}
				});
				
			},
		}
		
	}
</script>

<style lang="scss">
	page{
		padding-bottom: 90rpx;
	}
	.revice_address_row{
		
		
		.user_info_row{
			display: flex;
			padding: 20rpx;
			
			.user_info{
				flex: 5;
			}
			
			.user_phone{
				flex:3;
				text-align: right ;
			}
		}
	}
	.cart_content {
		.cart_title {
				padding: 20rpx;
				font-size: 36rpx;
				color: var(--themeColor);
				border-top: 1rpx solid #ccc;
				border-bottom: 1rpx solid #ccc;
		}
		
		
		.cart_main {
			
			.cart_item {
			display: flex;
			padding: 10rpx;
			border-bottom: 1rpx solid #ccc;
		
			
			.cart_img_wrap {
				flex: 2;
				display: flex;
				justify-content: center;
				align-items: center;
				image {
				width: 80%;
				}
			}
		
			
			.cart_info_wrap {
				flex: 4;
				display: flex;
				flex-direction: column;
				justify-content: space-around;
				.goods_name {
					display: -webkit-box;
					overflow: hidden;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2; 
					color: #666;
				}
		
				
			.goods_price_wrap {
				display: flex;
				justify-content: space-between;
				.goods_price {
					color: #e64340;
					font-size: 34rpx;
				}
		
				
				.cart_num_tool {
					display: flex;

		
					
				.goods_num {
						width: 55rpx;
						height: 55rpx;
						display: flex;
						justify-content: center;
						align-items: center;
					}
				}
				}
			}
			}
		}
		}
	.ft_bg{
		border-top: 1rpx solid #ccc;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 120rpx;
		background-color: #fff;
		display:flex;
		.footer_tool {
		position: relative;
		bottom: 0rpx;
		left: 0;
		width: 100%;
		height: 90rpx;
		background-color: #fff;
		display: flex;
		border-top: 1rpx solid #ccc;

		
		.total_price_wrap {
			flex: 5;
			padding-right: 15rpx;
			text-align: right;
			.total_price {
			font-size: 34rpx;
			.total_price_text {
				color: #e64340;
				font-size: 34rpx;
				font-weight: 600;
			}
			}
		
		}
		
		.order_pay_wrap {
			flex: 3;
			background-color: var(--themeColor);
			color: #fff;
			font-weight: 600;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		} 
	}

</style>